<template>
  <div class="updateType">
    <div class="biaoti">基本信息</div>
    <el-form ref="form" :model="form" label-width="100px" size="mini">
      <el-form-item label="假期类型">
        <el-input
          v-model="form.holidayType"
          placeholder="请输入"
          style="width: 220px"
        ></el-input>
      </el-form-item>
      <el-form-item label="适用范围">
        <el-select
          v-model="form.scopeOfApplication"
          placeholder="请选择"
          style="width: 220px"
        >
          <el-option label="全公司考勤" value="1"></el-option>
          <el-option label="技术部考勤" value="2"></el-option>
          <el-option label="技术部先锋组考勤" value="3"></el-option>
          <el-option label="产品部考勤" value="4"></el-option>
          <el-option label="销售部考勤" value="5"></el-option>
        </el-select>
      </el-form-item>
       <el-form-item label="负责人">
              <el-select v-model="form.headId" placeholder="请选择">
                <el-option
                  v-for="item in userList"
                  :key="item.id"
                  :label="item.nickName"
                  :value="item.id"
                >
                </el-option>
              </el-select>
            </el-form-item>
      <el-form-item label="单位时长">
        <el-select
          v-model="form.unitDuration"
          placeholder="请选择"
          style="width: 220px"
        >
          <el-option label="天" value="1"></el-option>
          <el-option label="半天" value="2"></el-option>
          <el-option label="小时" value="3"></el-option>
          <el-option label="分钟" value="4"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="一天折算为"
        >工作时长
        <el-input-number
          v-model="form.workTime"
          controls-position="right"
          :min="1"
          :max="10"
        ></el-input-number
        >小时
      </el-form-item>
      <el-form-item label="是否限额">
        <el-radio-group v-model="form.isRestrictions">
          <el-radio :label="1">限额</el-radio>
          <el-radio :label="2">不限额</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>

    <div class="biaoti">使用规则</div>
    <el-form ref="form" :model="form" label-width="110px" size="mini">
      <el-form-item label="请假证明">
        <el-radio-group v-model="form.leaveProve">
          <el-radio :label="0">无需证明</el-radio>
          <el-radio :label="1">不限额</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="计入请假的日期" prop="leaveDate">
        <el-checkbox-group v-model="form.leaveDate">
          <el-checkbox label="1" name="leaveDate">工作日</el-checkbox>
          <el-checkbox label="2" name="leaveDate">休息日</el-checkbox>
          <el-checkbox label="3" name="leaveDate">节假日</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="单次最小时长">
        <el-radio-group
          v-model="minDurationDisabled"
          @change="changeMinDuration"
        >
          <el-radio label="true">不限制</el-radio>
          <el-radio label="false">最少请假</el-radio>
        </el-radio-group>
        <el-input-number
          v-model="form.minDuration"
          :disabled="minDisable"
          controls-position="right"
          :min="1"
          :max="10"
        ></el-input-number
        >天
      </el-form-item>
      <el-form-item label="单次最大时长">
        <el-radio-group
          v-model="maxDurationDisabled"
          @change="changeMaxDuration"
        >
          <el-radio label="true">不限制</el-radio>
          <el-radio label="false">最多请假</el-radio>
        </el-radio-group>
        <el-input-number
          v-model="form.maxDuration"
          :disabled="maxDisable"
          controls-position="right"
          :min="1"
          :max="10"
        ></el-input-number
        >天
      </el-form-item>
      <el-form-item label="申请时间限制">
        <el-radio-group
          v-model="fileddurationDisabled"
          @change="changefiledRestrictionsDisabled"
        >
          <el-radio label="true">不限制</el-radio>
          <el-radio label="false">提前</el-radio>
        </el-radio-group>
        <el-input-number
          v-model="form.filedRestrictions"
          controls-position="right"
          :disabled="filedDisabled"
          :min="1"
          :max="10"
        ></el-input-number
        >天提交申请
      </el-form-item>
      <el-form-item label="申请资格">
        <el-radio-group
          v-model="filedQualiDisabled"
          @change="changefiledQualiRestrictionsDisabled"
        >
          <el-radio label="true">不限制</el-radio>、
          <!-- <el-radio label="false">转正后可申请</el-radio> -->
          <el-radio label="false">入职</el-radio>
        </el-radio-group>
        <el-input-number
          v-model="form.filedQualification"
          controls-position="right"
          :disabled="filedQualificationDisabled"
          :min="1"
          :max="10"
        ></el-input-number
        >天提交申请
      </el-form-item>
    </el-form>

    <div class="biaoti">余额设置</div>
    <el-form ref="form" :model="form" label-width="110px" size="mini">
      <el-form-item label="发放方式">
        <el-select
          v-model="form.issuanceMethod"
          placeholder="请选择"
          style="width: 220px"
        >
          <el-option label="每月发放一次" value="1"></el-option>
          <el-option label="每年发放一次" value="2"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="发放日期"
        >每月
        <el-input v-model="form.releaseDate" style="width: 80px"></el-input
        >号发放
      </el-form-item>
      <el-form-item label="发放额度">
        毎人每年发放
        <el-input-number
          v-model="form.issuanceQuota"
          controls-position="right"
          :min="1"
          :max="10"
        ></el-input-number
        >天
      </el-form-item>
      <el-form-item label="假期有效期">
        <el-input-number
          v-model="form.holidayValidity"
          controls-position="right"
          :min="1"
          :max="10"
        ></el-input-number
        >周年内有效&nbsp;&nbsp;&nbsp;超过有效期,假期余额保留
        <el-input-number
          v-model="form.retainTime"
          controls-position="right"
          :disabled="holidayValidityficationDisabled"
          :min="1"
          :max="10"
        ></el-input-number
        >天提交申请
      </el-form-item>
      <el-form-item size="large" class="anniu">
        <el-button type="primary" @click="addtype()">{{ subBut }}</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "updateType",
  data() {
    return {
      radio: "",
      // 单次最小时间输入框表示 true 代表不限制 值为0输入框禁用 false 解除禁用
      minDurationDisabled: "true",
      minDisable: true,
      // 单次最大时间输入框表示 true 代表不限制 值为0输入框禁用 false 解除禁用
      maxDurationDisabled: "true",
      maxDisable: true,
      // 申请时间限制输入框表示 true 代表不限制 值为0输入框禁用 false 解除禁用
      fileddurationDisabled: "true",
      filedDisabled: true,
      // 申请资格输入框表示 true 代表不限制 值为0输入框禁用 false 解除禁用
      filedQualiDisabled: "true",
      filedQualificationDisabled: true,
      //假期有效期输入框表示 true 代表不限制 值为0输入框禁用 false 解除禁用
      holidayValidityDisabled: "true",
      holidayValidityficationDisabled: true,
      //负责人动态下拉列表
      userList:[],
      //新增表单
      form: {
        holidayType: "",
        scopeOfApplication: "",
        unitDuration: "",
        workTime: "",
        isRestrictions: "",
        leaveProve: "",
        leaveDate: [],
        minDuration: "0",
        maxDuration: "",
        filedRestrictions: "",
        filedQualification: "",
        issuanceMethod: "",
        releaseDate: "",
        rulesId: undefined,
        settingId: undefined,
        // releaseRules: "",
        issuanceQuota: "",
        holidayValidity: "0",
        headId: "",
        retainTime: "",
      },
      // 提交按钮  
      subBut: "提交",
      id:this.$route.query.id
    };
  },
  created() {
    if(this.id!=null){
        this.handleEdit();
    }
    this.searchholiList();
  },
  methods: {
        //动态下拉列表框
  searchholiList() {
     this.$http
      .post("http://localhost:8030/holiday/findOptions")
      .then((res) => {
        this.userList = res.data;
      }).catch((error) => {
        console.error('获取部门列表失败:', error);
      });
    },
    //回显
    handleEdit() {
      this.$http
        .get("holiday/findholidayId?id=" + this.$route.query.id)
        .then((res) => {
          this.form = res.data;
          this.subBut = "修改";
          this.form.leaveDate = res.data.leaveDate.split(",");
          this.form.scopeOfApplication = res.data.scopeOfApplication + "";
          this.form.nickName = res.data.nickName + "";
          this.form.unitDuration = res.data.unitDuration +"";
          this.form.issuanceMethod = res.data.issuanceMethod +"";
        });
    },
   
    //新增假期类型
    addtype() {
      // 判断id是否为undefined
      if (this.id != null) {
        // 新建计入假期的日期变量接受数组的值
        var leaveDate1 = "";
        // 获取到数组
        var leaveDate = this.form.leaveDate;
        // 进行遍历
        for (var i = 0; i < leaveDate.length; i++) {
          // 判断该变量是否为空
          if (leaveDate1 === "") {
            // 如果为空则直接赋值
            leaveDate1 += leaveDate[i];
          } else {
            // 否则在前面加上“ , ”
            leaveDate1 += "," + leaveDate[i];
          }
        }
        // 将需要的值拿到后重新赋给表单中需要提交的变量
        this.form.leaveDate = leaveDate1;
        this.$http.post("holiday/updateHoliday", this.form).then((res) => {
          // this.sysdict = res.data;
          if (res.data.code == 200) {
            this.$message({
              message: "恭喜你，修改成功",
              type: "success",
            });
 this.$router.push("holiday");
          } else {
            this.$message.error("错了哦，修改失败");
          }
        });
      } else {
        // 新建计入假期的日期变量接受数组的值
        var leaveDate1 = "";
        // 获取到数组
        var leaveDate = this.form.leaveDate;
        // 进行遍历
        for (var i = 0; i < leaveDate.length; i++) {
          // 判断该变量是否为空
          if (leaveDate1 === "") {
            // 如果为空则直接赋值
            leaveDate1 += leaveDate[i];
          } else {
            // 否则在前面加上“ , ”
            leaveDate1 += "," + leaveDate[i];
          }
        }
        // 将需要的值拿到后重新赋给表单中需要提交的变量
        this.form.leaveDate = leaveDate1;

        this.$http.post("holiday/addHoliday", this.form).then((res) => {
          // this.tableData = res.data;
          if (res.data.code == 200) {
            this.$message({
              message: "恭喜你，新增成功",
              type: "success",
            });
             this.$router.push("holiday");
          } else {
            this.$message.error("错了哦，新增失败");
          }
        });
      }
    },
    //单次最小时长
    changeMinDuration(val) {
      if (val == "true") {
        this.form.minDuration = "0";
        this.minDisable = true;
      } else {
        this.minDisable = false;
      }
      console.log(val);
    },
    //单次最大时长
    changeMaxDuration(val) {
      if (val == "true") {
        this.form.maxDuration = "0";
        this.maxDisable = true;
      } else {
        this.maxDisable = false;
      }
      console.log(val);
    },
    //申请时间限制
    changefiledRestrictionsDisabled(val) {
      if (val == "true") {
        this.form.filedRestrictions = "0";
        this.filedDisabled = true;
      } else {
        this.filedDisabled = false;
      }
      console.log(val);
    },
    //申请资格
    changefiledQualiRestrictionsDisabled(val) {
      if (val == "true") {
        this.form.filedQualification = "0";
        this.filedQualificationDisabled = true;
      } else {
        this.filedQualificationDisabled = false;
      }
      console.log(val);
    },
    //假期有效期
    changeholidayValidityDisabled(val) {
      if (val == "true") {
        this.form.holidayValidity = "0";
        this.holidayValidityficationDisabled = true;
      } else {
        this.holidayValidityficationDisabled = false;
      }
      console.log(val);
    },
  },
};
</script>

<style scoped>

.biaoti {
  height: 40px;
  font-size: 15px;
}
</style>